<template>
    <el-dialog v-bind="$attrs" :visible.sync="flag" v-on="$listeners">
        <!-- 内容-star -->
        <el-tree 
            :data="rights" 
            :props="{ label:'authName' }" 
            node-key="id"
            default-expand-all 
            show-checkbox 
            ref="roleRights"
            ></el-tree>
        
        <!-- 内容-end -->
        <template #footer>
            <el-button @click="flag=false">取 消</el-button>
            <el-button type="primary" @click="setRoleRights()">确 定</el-button>
        </template>
    </el-dialog>
</template>

<script>
export default {
    data() {
        return {
            flag:false,
            rights:[],
            roleId:null
        }
    },
    methods:{
        close(){
            this.flag = false;
        },
        open(roleRight=[],roleId){
            this.flag = true;
            // console.log(roleRight);
            this.$nextTick(()=>{
                console.log(this.$refs.roleRights);
                this.roleId = roleId;
                this.$refs.roleRights.setCheckedNodes(roleRight)
                // this.$refs.roleRights.setCheckedKeys(roleRight)

            })
        },
        async loadAllRights(){
            let rights = await this.$api.getAllRights("tree")
            // console.log(rights);
            this.rights = rights;
        },
        async setRoleRights(){
            let all = this.$refs.roleRights.getCheckedKeys()
            let half = this.$refs.roleRights.getHalfCheckedKeys()
            // console.log(all,half);
            let rids = all.concat(half).join(",")
            console.log(rids,this.roleId);
            // 发送请求

            // 关闭dailog

            // 父页面需要重载数据


        }
    },
    created(){
        this.loadAllRights()
    }
}
</script>